<template>
    <div class="nav_child app">
        <!-- <van-nav-bar
            :title="$route.meta.title"
            left-text=""
            border
            left-arrow
             @click-left="onClickLeft"
            /> -->
        <div class="course_contant">
            <ul>
                <template v-if="!$util.isEmpty(list)">
                    <li v-for="(item,index) in list" :key="index" @click="skiptoadddymac(item)">
                        <div class="dynamic_img">
                            <img :src="item.images" alt="">
                        </div>
                        <p>{{item.title}}</p>
                        <a class="rigt_more">
                            <img :src="`${constant.imgUrl}center/icon_right_arrow_large.png`" alt="">
                        </a>
                    </li>
                </template>
            </ul>
        </div>
    </div>
</template>

<script>
import $apiCompany from '@/api/company'
export default {
	name: 'NewsList',
	data() {
		return {
			checked: true,
			list: [],
			constant: this.$constant,
			query: null
		}
	},
	onLoad(val) {
		this.query = val
	},
	mounted() {
		this.init()
	},
	methods: {
		init() {
			$apiCompany.getNews({
				company_id: this.query.owner_user_id
			})
				.then(res => {
					if (res.status == 'success') {
						this.list = res.data
					} else {
						uni.showToast({
							title: res.errors.message,
							duration: 2000,
							icon: 'none'
						})
					}
				})
		},
		skiptoadddymac(item) {
			window.location.href = item.url
		}
	}
}
</script>

<style scoped lang="scss">
    .nav_child {
        padding-top: 20px;
        background: none;
        background-color: #f5f5f5;
        min-height: 100%;
    }
    .course_contant ul{
        width: 90%;
        margin-left: 5%;
        height: auto;
    }
    .course_contant ul li{
        width: 100%;
        height: 200px;
        margin-top: 30px;
        border-radius: 20px;
        background: white;
        position: relative;
    }
    .dynamic_img{
        width: 140px;
        height: 140px;
        float: left;
        margin: 30px;
        background: green;
    }
    .dynamic_img img{
        width: 100%;
        height: 100%;
        float: left;
    }
    .course_contant ul li p{
        font-size: 34px;
        margin-top: 58px;
        line-height: 50px;
        float: left;
        width: 370px;
        display: -webkit-box;
        word-break: break-all;
        -webkit-line-clamp: 2;
        overflow: hidden;
        text-overflow: ellipsis;
        /*! autoprefixer: off */
        -webkit-box-orient: vertical;
        /* autoprefixer: on */
    }
    .course_contant ul li .rigt_more{
        width: 15px;
        height: 28px;
        float: right;
        margin-top: 13%;
        margin-right: 5%;
    }
    .course_contant ul li .rigt_more img{
        width: 100%;
        height: 100%;
        float: left;
    }
    .delete_expe {
        width: 30px;
        height: 30px;
        position: absolute;
        right: -10px;
        top: -10px;
        float: right;
    }

    .delete_expe img {
        width: 100%;
        height: 100%;
        float: left;
    }
</style>
